import 'package:flutter/material.dart';

void main() {
  // 1. 运行应用程序。
  runApp(const MaterialApp(home: Main()));
}

// 2. 主应用程序类。
class Main extends StatelessWidget {
  // 3. 构造函数，包含一个关键参数，用于在Widget树中唯一标识这个Widget。
  const Main({super.key});

  // 4. 构建方法，返回一个Widget，该Widget代表应用程序的用户界面。
  @override
  Widget build(BuildContext context) {
    // 5. 返回一个Scaffold，用于定义应用程序的基本布局结构。
    return Scaffold(
      // 6. 设置应用程序的顶部栏，包括标题和背景颜色。
      appBar: AppBar(
        title: const Text(
          '商品订单信息',
          style: TextStyle(color: Colors.white),
        ),
        backgroundColor: Colors.purple,
      ),
      // 7. 设置应用程序的主体内容，包括一个Container和一个Text组件。
      body: Container(
        padding: const EdgeInsets.all(10),
        color: Colors.black12,
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.end,
          children: [
            // 标题
            const Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Text('2024-08-15 21:49:48'),
                Text(
                  '待发货',
                  style: TextStyle(color: Colors.amber),
                )
              ],
            ),
            const SizedBox(height: 10),

            // 商品信息

            Row(
              children: [
                // 商品图片
                Image.network(
                  'https://yanxuan-item.nosdn.127.net/a09de222ed32efa8ffe359b1d5780574.jpg',
                  width: 100,
                ),
                const SizedBox(width: 10),

                // 商品信息

                Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    // const SizedBox(
                    // width: 500,
                    // child:
                    const Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Text(
                          '茶水分离杯 耐热隔热玻璃杯茶水分离杯 耐热隔热玻璃杯茶水分离杯 耐热隔热玻璃杯茶水分离杯 耐热隔热玻璃杯茶水分离杯 耐热隔热玻璃杯茶水分离杯 耐热隔热玻璃杯茶水分离杯 耐热隔热玻璃杯茶水分离杯 耐热隔热玻璃杯',
                          maxLines: 2,
                          overflow: TextOverflow.ellipsis,
                        ),
                        Text('x2'),
                      ],
                    ),
                    // ),
                    Container(
                      color: Colors.white54,
                      child: const Text(
                        '规格：白240ml',
                        style: TextStyle(
                          color: Colors.grey,
                          fontSize: 12,
                        ),
                      ),
                    ),
                    const Text('￥119.5'),
                  ],
                ),
              ],
            ),

            // 总价格和按钮
            const Text('合计：￥239.0'),
            const SizedBox(height: 10), // 间隔
            Row(
              mainAxisSize: MainAxisSize.min,
              children: [
                ElevatedButton(
                  onPressed: () {},
                  child: const Text('详细查看'),
                ),
                const SizedBox(width: 10),
                FilledButton(
                  onPressed: () {},
                  child: const Text('再次购买'),
                )
              ],
            )
          ],
        ),
      ),
    );
  }
}
